// $baseFontSize: 20px !default;       
// @function pxToRem($px) {
//   @return $px / $baseFontSize * 1rem;
// }
a{
	-webkit-tap-highlight-color: rgba(255,255,255,0);
}
@mixin flexChild{
	display: block;
	float: left;
	box-sizing: border-box;
}
// header
.jd-contain{
	width:100%;
	min-width:320px;
	max-width:640px;
	margin:0 auto;
}
.jd-header-top{
	border-bottom: 1px solid #d7d7d7;
}
.jd-header{
	width: 100%;
	position: relative;
	background: #fafafa;
	.jd-header-back{
		position: absolute;
		left: 10px;
		top: 12px;
		span{
			background: url(../img/jd-sprites.png) no-repeat -23px 0;
			display: inline-block;
			width: 19px;
			height: 20px;
			background-size: 200px 200px;
		}
	}
	.jd-header-my{
		text-align: center;
		line-height: 44px;
		font-size: 16px;
	}
	.jd-header-coll{
		position: absolute;
		top: 12px;
		right: 10px;
		i{
			background: url(../img/jd-sprites.png) no-repeat -60px 0;
			display: inline-block;
			width: 20px;
			height: 20px;
			background-size: 200px 200px;
		}
	}
	.jd-header-menu{
		width: 100%;
		height: 57px;
		position: relative;
		background: #404042;
		display: none;
		li.active{
			background:#2d2d2d;
		}
		li{
			width: 25%;
			height: 100%;
			float: left;
			text-align: center;
			span{
				width: 30px;
				height: 26px;
				display: block;
				margin: 10px auto 0;
				background: url(../img/jd-sprites.png) no-repeat;
				background-size: 200px 200px;
			}
			em{
				color: #fff;
			}
			.home{
				background-position: -30px -31px;
			}
			.search{
				background-position: -60px -31px;
			}
			.buycar{
				background-position: -90px -31px;
			}
			.mineJd{
				background-position: -120px -31px;
			}
		}
	}
}
// vip
.jd-vip{
	width: 100%;
	height: 139px;
	color: #fff;
	position: relative;
	z-index: 10;
	.jd-vip-pic{
		position: absolute;
		top:0;
		left:0;
		z-index: -1;
		height: 140px;
		width: 100%;
		img{
			width: 100%;
			height: 100%;
		}
	}
	.jd-vip-info{
		position: relative;
		.jd-vip-pers{
			width: 56px;
			height: 56px;
			margin:19px 14px 0;
			img{
				width: 100%;
				height: 100%;
				border-radius: 50% 50%;
			}
		}
		.jd-vip-regist{
			line-height:18px;
			p{
				margin-top: 25px;
				margin-bottom: 18px;
				font-size: 16px;
			}
			.i{
				width: 122px;
				height: 18px;
				display: inline-block;
				margin-left: 6px;
				border: 1px solid #4c4a48;
				border-radius: 10px;
				background: rgba(76,74,72,0.3);
				em{
					width: 20px;
					height: 18px;
					display: block;
					float:left;
					margin-right: 7px;				
					background: url(../img/58173a43Nc71052cf.png) 4px 4px no-repeat #4c4a48;
					background-size: 11px 8px;
					border-radius: 50% 50%;
				}
				b{
					background: url(../img/right.png) no-repeat right;
					background-size: 5px 9px;
					padding-right: 12px;
				}
			}
		}
		.jd-vip-count{
			background: url(../img/right.png) no-repeat right;
			background-size: 5px 9px;
			padding-right: 15px;
			margin-right: 15px;
			margin-top: 40px;
			color: #e3e5e9;
			position: absolute;
			right: 0;
			top: 0;
		}
	}
	ul{
		width: 100%;
		margin-top: 12px;
		a{
			@include flexChild;
			width: 33.333333333333333333%;
			li{
				height: 45px;
				padding-top: 10px;
				text-align: center;
				color: #e3e5e9;
				background: #bb2112;
				box-sizing: border-box;
			}
		}
		a.middle{
			border-left: 1px solid #ec392d;
			border-right: 1px solid #ec392d;
		}
	}
}
// order
.jd-order{
	width: 100%;
	background: #fff;
	border-top: 10px solid #f0f2f5;
	border-bottom: 12px solid #f0f2f5;
	.order{
		height: 42px;
		padding: 12px 10px;
		box-sizing: border-box;
		border-bottom: 1px solid #f1f2f4;
		h3{
			height: 19px;
   			line-height: 16px;
			i{
				width: 15px;
				height: 18px;
				display: inline-block;
				margin-right: 6px;
				vertical-align: bottom;
				img{
					width: 100%;
					height: 100%;
				}
			}
			span{
				font-size: 14px;
				color: #232326;
			}
		}
		.order-right{
			color: #848689;
			background: url(../img/multi.png) no-repeat 50px -21px;
			background-size: 200px 200px;
			padding-right: 15px;
		}
	}
	ul{
		padding-bottom: 10px;
		a{
			@include flexChild;
			width: 33.333333333333333333%;
			li{
				text-align: center;
				i{
					width: 21px;
					height: 18px;
					margin: 18px auto 0;
					display: block;
					img{
						width: 100%;
						height: 100%;
					}
				}
				span{
					color: #232326;
					margin-bottom: 10px;
				}
			}
		}
	}
}
// money
.jd-money{
	width: 100%;
	background: #fff;
	border-bottom: 12px solid #f0f2f5;
	.money{
		height: 42px;
		padding: 12px 10px;
		box-sizing: border-box;
		border-bottom: 1px solid #f1f2f4;
		h3{
			height: 19px;
   			line-height: 16px;
			i{
				width: 15px;
				height: 18px;
				display: inline-block;
				vertical-align: bottom;
				margin-right: 6px;
				img{
					width: 100%;
					height: 100%;
				}
			}
			span{
				font-size: 14px;
				color: #232326;
			}
		}
		.money-right{
			background: url(../img/multi.png) no-repeat 2px -20px;
			background-size: 200px 200px;
			width: 14px;
			height: 20px;
		}
	}
	ul{
		padding-bottom: 10px;
		a{
			@include flexChild;
			width: 25%;
			li{
				text-align: center;
				p{
					font-size: 15px;
					margin: 18px auto 5px;
				}
				span{
					color: #232326;
					margin-bottom: 10px;
				}
			}
		}
	}
}
// list-first
.list-first,.list-second{
	background: #fff;
	width: 100%;
	border-bottom: 12px solid #f0f2f5;
	li{
		height: 44px;
		line-height: 44px;
		.list-img{
			width: 18px;
			margin-left: 10px;
			margin-right: 10px;
			img{
				width: 100%;
			}
		}
		.list-txt{
			margin-left: 40px;
			border-bottom: 1px solid #f1f2f4;
			.list-left{
				font-size: 14px;
				color: #232326;
			}
			.list-right{
				margin-right: 10px;
				color: #848689;
				em{
					display: inline-block;
					width:10px;
					height: 15px;
					background: url(../img/multi.png) no-repeat 0 -22px;
					background-size: 200px 200px;
					vertical-align: middle;
				}
			}
		}
	}
}
.list-second{
	border-bottom: none;
}
// recommend
.recommend{
	height: 50px;
	line-height: 50px;
	background: #f0f2f5;
	color: #848689;
	position: relative;
	text-align: center;
	span{
		position: absolute;
		padding: 0 10px;
		box-sizing: border-box;
		left: 50%;
		margin-left: -50px;
		display: block;
		z-index: 3;
		background: #f0f2f5;
		em{
			display:inline-block;
			width: 13px;
			height: 15px;
			vertical-align:middle;
			margin-right: 10px;
			background: url(../img/up.png) no-repeat;
			background-size: 13px 13px;
		}
	}
	.recommend-line{
		width: 100%;
	    position: absolute;
	    top: 50%;
	    left: 0;
	    height: 1px;
	    background: #dedfe0;
	}
}
// recommendList
.recommendList{
	background: #dedfe0;
	width: 100%;
	li:nth-child(2n+1){
		padding-right: 4px;
		box-sizing: border-box;
	}
	li{
		width: 50%;
		margin-bottom: 4px;
		div{
			background: #fff;
			position: relative;
			padding-bottom: 5px;
			img{
				width: 100%;
				height: 172px;
			}
			span{
				color: #232326;
				overflow: hidden;
				text-overflow: ellipsis;
				// word-break: break-word;
				// display: -webkit-box;
				// -webkit-line-clamp:2;
				// -webkit-box-orient: vertical;
				height: 20px;
				display: block;
				white-space: nowrap;
				padding: 0 4px;
				margin: 5px 0;
				font-size: 13px;
			}
			.price{
				color: #f23030;
				font-size: 14px;
				b{
					font-size: 16px;
					font-weight: bold;
				}
			}
			i{
				width: 49px;
				height: 23px;
				line-height: 23px;
				text-align: center;
				border: 1px solid #e7e7e7;
				color: #686868;
				position: absolute;
				bottom: 4px;
				right: 7px;
			}
		}
	}
	li:nth-last-of-type(1),li:nth-last-of-type(2){
		margin-bottom: 0;
	}
}
// no-more
.no-more{
	width: 194px;
	height: 72px;
	display: block;
	margin: 0 auto;
}
// footer
.footer{
	width: 100%;
	background: #f8f8f8;
	.w100{
		width: 100%;
		border-top: 1px solid #bfbfbf;
		.footer-menu{
			height: 15px;
			padding: 18px 0;
			margin: 0 auto;
			width: 320px;
			display: table;
			li{
				width: 69px;
				line-height: 15px;
				display: table-cell;
				box-sizing: border-box;
				text-align: center;
				border-right: 1px solid #d7d7d7;
				a{
					color: #848689;
					width: 72px;
					text-overflow: ellipsis;
					overflow: hidden;
					white-space: nowrap;
					display: inline-block;
				}
			}
			li:first-child,li:last-child{
				width: 90px;
			}
			li:last-child{
				border:none;
			}
		}
		.footer-version{
			height: 15px;
			padding: 8px 0;
			margin: 0 auto;
			width: 320px;
			display: table;
			li{
				display: table-cell;
				width: 33px;
				box-sizing: border-box;
				text-align: center;
				a{
					display: block;
					margin: 0 auto;
					color: #848689;
					height: 38px;
					width: 40px;
					padding-top: 40px;
					box-sizing: border-box;
					background: url(../img/jd-sprites.png) no-repeat;
					background-size: 200px 200px;
				}
				a.active{
					color: #252525;
				}
				a.client{
					background-position: -116px -70px;
				}
				a.touch{
					background-position: -36px -70px;
				}
				a.pc{
					background-position: -76px -70px;
				}
			}
		}
	}
	.footer-last{
		border-bottom: 1px solid #bfbfbf;
	}
	.copyright{
		width: 100%;
		height: 44px;
		color: #848689;
		text-align: center;
		line-height: 44px;
	}
}
// fixed-toUp
.fixed-toUp{
	width: 35px;
	height: 35px;
	position: fixed;
	bottom: 60px;
	right: 8px;
	z-index: 10;
	display: none;
	img{
		width: 100%;
		height: 100%;
	}
}